<!DOCTYPE html> 
<html> 
	<head> 
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1"> 
		<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
		<link rel="stylesheet" href="http://jquerymobile.com/demos/1.0b1/docs/_assets/css/jqm-docs.css" />
		<link rel="stylesheet" href="/css/page42.css" />
		<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
		<script src="/js/page42.js"></script>
		<script type="text/javascript">
		
		var hey = "hey";
		var start = 1;
		var searchText = "";
		var total = 42;
		
		// getting url param.
		function getURLParameter(name) {
			var s = decodeURI(
				(RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
			);
			
			return s; 
		}
		
		// visualize search result
		function setSearchResultForGoogle(data){
			var str = '';
			console.log(data);
	
			
			//try {
				for (var i = 0; i < data.items.length; i++){
					var item = data.items[i];
					var imglinks = item.volumeInfo.imageLinks;
					var title = item.volumeInfo.title;
					var authors = item.volumeInfo.authors;
					var isbn13 = '';
					if (typeof(item.volumeInfo.industryIdentifiers[0]) != 'undefined') {
						if (item.volumeInfo.industryIdentifiers[0].type =="ISBN_13") {
							isbn13 = item.volumeInfo.industryIdentifiers[0].identifier;
						}
						else if (typeof(item.volumeInfo.industryIdentifiers[1]) != 'undefined'){	
							if (item.volumeInfo.industryIdentifiers[1].type =="ISBN_13"){
								isbn13= item.volumeInfo.industryIdentifiers[1].identifier
							}
						}
					}
					
					if (isbn13 == '') continue;
					
					var bookpage = "book/"+isbn13+"?gid="+item.id;
					//var selflink = item.selfLink;
					
					if (typeof(imglinks) != 'undefined'){	
						thumb = imglinks.thumbnail;//smallThumbnail;
						str+='<li><a href="'+bookpage+'"><img src="'+thumb+'"/><h3>'+title+'</h3><p>'+authors+'</p></a></li>'
					}
					else{
						thumb = 'http://www.rockymountainsmiths.org/library/Placeholder_book.png'; // placeholder
						str+='<li><a href="'+bookpage+'"><img src="'+thumb+'"/><h3>'+title+'</h3><p>'+authors+'</p></a></li>'
						
					}
					  
					
					
					// TODO: pageCount or dimensions to visualize 
				  
				}
				
				// TODO: auto loading for next find result by scrolling. remove empty()
				
				$('#result').empty();
				$('#result').append(str);
				$("#result").listview( "refresh" );   
			//}
			// exception for no data
			/*catch (err){
				console.log(str);
				console.log(err);
				return false;
			}*/
		}
		
	
	
		function getDataForNaver(data){
			var str ='';
			var channel = data.query.results.rss.channel;
			var start = channel.start;
			var books = channel.item;
			
			total = channel.total;
			
			for (var i = 0; i < books.length; i++){
				var item = books[i];
				var thumb = item.image;
				var title = item.title;
				var authors = item.author;
				var isbn13 = item.isbn;
				var pubdate = item.pubdate;
				var bookpage = "/book/"+isbn13;
				//var selflink = item.selfLink;
				
				str+='<li><a href="'+bookpage+'"><img src="'+thumb+'"/><h3>'+title+'</h3><p>'+authors+'</p></a></li>'
			}
			return str;
		}
	
		function setSearchResultForNaver(data){
			
			var str = getDataForNaver(data)
			
			//$('#result').empty();
			
			
			
			$('#result').append(str);
			$("#result").listview( "refresh" );
			
			$("#loadmoretext").text("Load More...");
			
			console.log(data);
		}
		
		// Infinite Scroll
		$(window).scroll(function(){
			if  ($(window).scrollTop() == $(document).height() - $(window).height()){
			   
			   start = start + 10;
			   if (start > total) return;
			   
			   var loadStr = "<li><h2>Load More Books</h2></li>"; 
			   
			   var url_yql = 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%20%3D%20%22http%3A%2F%2Fopenapi.naver.com%2Fsearch%3Fkey%3D81694fdfd82a615c8821bf5be3c1cc16%26target%3Dbook%26query%3D'+searchText+'%26display%3D10%26start%3D'+start+'%26sort%3Dsim%22&format=json';
			   
			
			$("#loadmoretext").text("Loading...");

			$.ajax({
				type: "get",
				url: url_yql,
				success: setSearchResultForNaver,
				crossDomain: true,
				dataType: "jsonp"
			});
			   
			}
		});
		
		$(document).ready(function() {
			////
			// swipe gesture
			////
			$('#result').live('swipeleft swiperight',function(event){
				//console.log(event);
				// TODO: swipe gesture for finding page
			});			
			
			////
			//	searching books
			////
			var searchParam = getURLParameter('search');
			
			if (searchParam == 'null') return; // if no search query, then show user's recent books
			
			// Create a regular expression to search all +s in the string
			var lsRegExp = /\+/g;
			var searchInput = unescape(String(searchParam).replace(lsRegExp, " "));
			$('#search').attr('value', searchInput)
			
			// query text
			var ws = "%2520"
			searchText = searchParam.replace("+", ws);
			
			//$('#result').html('finding...'); // TODO: fix
			
			// for naver
			/*
			var key = '81694fdfd82a615c8821bf5be3c1cc16';
			var apiurl = 'http://openapi.naver.com/search?key='+key+'&target=book&query='+searchInput+'&display=10&start=1&sort=sim';
			var yql = "select * from xml where url = \""+apiurl+"\"";
			var url_yql = "http://query.yahooapis.com/v1/public/yql?q="+escape(yql)+"&format=json&callback=";
			*/
			
			var url_yql = 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%20%3D%20%22http%3A%2F%2Fopenapi.naver.com%2Fsearch%3Fkey%3D81694fdfd82a615c8821bf5be3c1cc16%26target%3Dbook%26query%3D'+searchText+'%26display%3D10%26start%3D'+start+'%26sort%3Dsim%22&format=json';
			
			$("#loadmoretext").text("Loading...");
			
			$.ajax({
				type: "get",
				url: url_yql,
				success: setSearchResultForNaver,
				crossDomain: true,
				dataType: "jsonp"
			});
			
			/* for google
			var key = 'AIzaSyCSPRhfVqueRQ5KzjvRqSSHZEOmUBYv0Lc';
			var apiurl = 'https://www.googleapis.com/books/v1/volumes?q='+search+'&key='+key;
			// '&langRestrict='+'ko';
			
			$.ajax({
				url: apiurl,
				success: setSearchResultForGoogle,
				crossDomain: true,
				dataType: "jsonp"
			});
			*/

		});
		
		
		</script>
		
		<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
	</head> 
	<body> 
	<div data-role="page">
        <div data-role="header" >
			<h1>Find</h1>
			<a href="/find" data-icon="refresh" class="ui-btn-right" data-iconpos="notext" theme="b" data-ajax="false">Refresh</a>
        </div>
        <div data-role="content">
			<div data-role="fieldcontain" class="notopmargin"><form>
					<input type="search" name="search" id="search">
					<input type="submit" value="find" data-inline="true">
			</form></div>
			<ul data-role="listview" id="result">
			</ul>
			<ul data-role="listview" id="loadmore">
				<li><h1 id="loadmoretext">Load More</h1></li>
			</ul>
		</div>
    </div>
	</body> 
</html> 
 